<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:replace="fragment/head"/>
    <!-- BEGIN PAGE LEVEL PLUGINS -->
    <link href="resources/assets/global/plugins/datatables/datatables.min.css" rel="stylesheet" type="text/css"/>
    <link href="resources/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css" rel="stylesheet"
          type="text/css"/>
</head>

<body class="page-header-fixed page-sidebar-closed-hide-logo page-container-bg-solid page-content-white page-sidebar-closed">
<th:block th:with="
    ERPConstants = ${T(com.sh.caryr.erp.util.ERPConstants)} ,
    authTarget = ${ERPConstants.AUTH_TARGET_USER}
">
    <th:block th:replace="fragment/header"/>
    <div class="page-container">
        <!-- BEGIN SIDEBAR -->
        <th:block th:replace="fragment/sidebar"/>
        <!-- BEGIN CONTENT -->
        <div class="page-content-wrapper">
            <!-- BEGIN CONTENT BODY -->
            <div class="page-content">
                <!-- BEGIN PAGE BAR -->
                <div class="page-bar">
                    <ul class="page-breadcrumb">
                        <li><a href="index.html" class='msg_home'>主页</a> <i class="fa fa-circle"></i></li>
                        <li><span class='msg_sku'>管理</span></li>
                    </ul>
                </div>
                <!-- BEGIN PAGE TITLE-->
                <h1 class="page-title">
                    <span class="msg_title_sku">   PageTitle</span>
                    <small class="msg_subtitle_sku">sub title</small>
                </h1>
                <!-- BEGIN main content -->
                <div class="row">
                    <!-- BEGIN ===========page level content============= -->
                    <div class="col-md-12">
                        <!-- BEGIN data table-->
                        <div class="portlet box green datatable-portlet">
                            <div class="portlet-title">
                                <div class="caption">
                                    <i class="fa fa-list"></i><span class='msg_listTitle'>列表</span>
                                </div>
                                <div class="tools">
                                    <button id="btn_refresh_dt" class="btn sbold green">
                                        <i class="fa icon-refresh"></i>
                                    </button>
                                </div>
                            </div>
                            <div class="portlet-body">
                                <table class="table table-striped table-bordered table-hover dt-responsive"
                                       id="dt_skuRecord" cellspacing="0" width="100%">
                                    <thead>
                                    <tr>
                                        <th width='' class='msg_ent_fld_name'></th>
                                        <th width='' class='msg_ent_fld_code'></th>
                                        <th width='' class='msg_ent_fld_totalAmount'></th>
                                        <th width='' class='msg_ent_fld_usableAmount'></th>
                                        <th width='' class='msg_ent_fld_notGoodAmount'></th>
                                        <th width='' class='msg_ent_fld_lockedAmount'></th>
                                        <th width='' class='msg_ent_fld_handleTime'></th>
                                        <th width='' class='msg_ent_fld_type'></th>
                                        <th width='' class='msg_ent_fld_handleType'></th>
                                        <th width='' class='msg_ent_fld_remark'></th>
                                    </tr>
                                    </thead>
                                </table>
                            </div>
                        </div>
                    </div>

                    <div id="copyModal" class="formModal caryr-bg-blue modal fade" tabindex="-1" data-width="400">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header caryr-bg-blue">
                                    <button type="button" class="close" data-dismiss="modal"
                                            aria-hidden="true"></button>
                                    <h4 class="modal-title">复制</h4>
                                </div>
                                <div class="modal-body">
                                    <form role="form">
                                        <div class="form-body">
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button id="btn_copy" type="button" data-dismiss="modal" class="btn blue">复制
                                    </button>
                                    <button type="button" data-dismiss="modal"
                                            class="btn grey-salsa btn-outline msg_com_formCancel">取消
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- END   ===========page level content============= -->
                </div>
            </div>
        </div>
    </div>
    <th:block th:replace="fragment/rear"/>
    <!-- BEGIN PAGE LEVEL PLUGINS -->
    <script src="resources/assets/global/plugins/datatables/datatables.min.js"></script>
    <script src="resources/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js"></script>
    <script src="resources/assets/global/plugins/bootstrap-maxlength/bootstrap-maxlength.min.js"></script>
    <script src="resources/assets/caryr/caryr.datatable.js" type="text/javascript"></script>
    <!-- BEGIN PAGE LEVEL SCRIPTS -->
    <script th:inline="javascript">
        jQuery(document).ready(function () {

            /*[+
            caryr.lang = [[${session.lang}]];
            +]*/

            var tableId = '#dt_skuRecord',
                formId = '#skuRecord_edit_form';
            /***************** dataTable **************/
            var dataTable = caryr.dataTable.create({
                url: "api/skuRecord",
                defaultOrderBy: 6,
                tableId: tableId,
                lang: caryr.lang,
                disableView: true,
                disableCheckbox: true,
                columns: [
                    {data: 'name'},
                    {data: 'code'},
                    {
                        orderable: false,
                        render: function (data, type, row) {
                            var totalAmount = row.usableAmount + row.lockedAmount + row.notGoodAmount;
                            var style = "label-default";
                            if (totalAmount <= 0) {
                                style = "label-danger";
                            }
                            return "<span class='label label-sm " + style + " '>" + totalAmount + "</span>";
                        }
                    },
                    {data: 'usableAmount'},
                    {data: 'notGoodAmount'},
                    {data: 'lockedAmount'},
                    {data: 'handleTime'},
                    {
                        data: 'type',
                        render: function (e) {
                            return "<span class='msg_ent_fld_skuRecord_type_" + e + "'></span>";
                        }
                    },
                    {
                        data: 'handleType',
                        render: function (e) {
                            return "<span class='msg_ent_fld_skuRecord_typeHandle_" + e + "'></span>";
                        }
                    },
                    {
                        data: 'remark',
                        render: function (e, entity) {
                            var html = e;
                            if (entity.type = '2') {
                                html = "<a href='orderDetails?orderId=" + e + "' target='_blank'>" + e + "</a>";
                            }
                            return html;
                        }
                    }
                ],
                onViewEvent: function (data) {
                    caryr.refreshEditForm(data, false, formId); //Refresh form
                    $('#detailModal').modal('show');
                }
            });

            $('#btn_add_entity').on('click', function () {	//attach create entity
                caryr.refreshEditForm({}, true, formId);
                $('#detailModal').modal('show');
            });
            /***************** Edit form **************/
            caryr.getFormInstatnce('skuRecord_edit_form', {
                url: 'api/skuRecord',
                validateForm: function (formResult, form) {
                    if (!formResult) {
                        $('#detailModal').modal('show');
                    } else {
                        $('#detailModal').modal('hide');
                    }
                    return formResult;
                },
                afterSaveSuccess: function (data, action) {
                    var id = action == "POST" ? data.data : data.data.id;
                    if (id) {
                        this.form.find('.edit_data input[name="id"]').val(id);
                        dataTable.draw();
                        caryr.showTab('#tab_li_entity_list');
                    } else {
                        swal({
                            title: $.i18n.prop("msg_com_systemError"),
                            text: "",
                            type: "error"
                        });
                    }
                },
                afterSaveAndNewSuccess: function (data, action) {
                }
            });
        });
    </script>
</th:block>
</body>
